import { EChartsOption } from "echarts";

export const legendCommonConfig: EChartsOption["legend"] = (() => {
  return {
    icon: "circle",
    itemWidth: 8,
    itemHeight: 8,

    itemGap: 18,
    right: 18,
    top: 4,
    textStyle: {
      color: "#AFBFE0",
      fontSize: 12,
      lineHeight: 14,
      rich: {
        a: {
          verticalAlign: "middle",
        },
      },
      // 上 有 下 左边
      padding: [0, 0, -2, 0],
    },

    data: ["销售", "采购", "毛利润"],
  };
})();

export const lineChartSeriesCommonConfig: any = (() => {
  return {
    type: "line",
    stack: "Total",
    smooth: true,
    lineStyle: {
      width: 1,
    },
    showSymbol: false,
  };
})();

export const lineChartYAxisCommonConfig: any = (() => {
  return {
    type: "value",
    name: "单位：万元",
    axisTick: {
      show: false,
    },
    axisLabel: {
      color: "#AFBFE0",
      opacity: 0.8,
    },
    splitLine: {
      show: true,
      lineStyle: {
        type: "solid",
        color: "#899dbf",
        opacity: 0.29,
      },
    },
  };
})();

export const lineChartXAxisCommonConfig: any = (() => {
  return {
    boundaryGap: false,
    type: "category",
    axisTick: {
      show: false,
    },
    axisLabel: {
      color: "#AFBFE0",
      opacity: 0.8,
    },

    axisLine: {
      show: false,
    },
  };
})();

export const lineChartGridCommonConfig: EChartsOption["grid"] = (() => {
  return {
    containLabel: true,
    left: 16,
    top: 40,
    bottom: 16,
    right: 16,
  };
})();

export const lineChartTooltipCommonConfig: EChartsOption["tooltip"] = (() => {
  return {
    trigger: "axis",
    axisPointer: {
      type: "cross",
    },
    padding: 0,
    borderRadius: 8,

    backgroundColor: "transparent",
    borderColor: "rgba(181,213,243,0.7)",
  };
})();
